<template>
  <div class="list">
    <div class="listIn" v-for="list in lists" @click="clickList(list)">
      <img alt="活动图标" v-bind:src="list.cover">
      <p v-text="list.name"></p>
    </div>
  </div>
</template>

<script>
  import { requestStore, requestMe } from '../../api/api'
  export default{
    name: 'list',
    data () {
      return {
        lists: [],
        token: '',
        show1: true,
        text1: 'Processing'
      }
    },
    mounted: function () {
      this.$nextTick(function () {
        this.lodaMe()
      })
    },
    methods: {
      lodaData: function () {
        let e = this
        requestStore({}).then(function (res) {
          e.lists = res.data.data
        })
      },
      lodaMe: function () {
        let e = this
        requestMe({}).then((user) => {
          if (user && user.role_list) {
            if (user.role_list.is_store_spreader !== false) {
              e.lodaData()
            } else {
              e.$swal('error', '您不是会籍', 'error')
              window.localStorage.removeItem('user')
            }
          }
        })
      },
      clickList: function (obj) {
        this.$router.push({ path: '/crowdfunding?sponsorsId=' + obj.id })
      }
    }
  }
</script>

<style lang="less" scoped>
  @bdcolor:#ededed;
  body{
    background: @bdcolor;
  }
  .list{
    width: 100%;
    height: 100%;
    .listIn{
      width: 610/2/10rem;
      height: 300/2/10rem;
      margin:0.3rem auto 0.6rem;
      position: relative;
      background: #fff;
      border-radius: 0.25rem;
      img{
        width: 100%;
        height: 100%;
        display: block;
        position: absolute;
        left:0;
        top:0;
      }
      p{
        width: 30.5-0.8rem;
        height: 32/2/10rem;
        background: rgba(0,0,0,0.4);
        color: #fff;
        position: absolute;
        left:0;
        bottom:0.5rem;
        padding:0 0.4rem;
      }
    }
  }
</style>

